<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="style/style.css" media="all" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
	<script>
		!window.jQuery && document.write('<script src="jquery-1.4.3.min.js"><\/script>');
	</script>
	<!-- <script type="text/javascript" src="./fancybox/jquery.mousewheel-3.0.4.pack.js"></script> -->
	<script type="text/javascript" src="./fancybox/jquery.fancybox-1.3.4.pack.js"></script>
	<link rel="stylesheet" type="text/css" href="./fancybox/jquery.fancybox-1.3.4.css" media="screen" />
	
 	<link rel="stylesheet" href="style.css" />
	<script type="text/javascript">
		$(document).ready(function() {
			/*
			*   Examples - images
			*/

			$("a#example1").fancybox();

			$("a#example2").fancybox({
				'overlayShow'	: false,
				'transitionIn'	: 'elastic',
				'transitionOut'	: 'elastic'
			});

			$("a#example3").fancybox({
				'transitionIn'	: 'none',
				'transitionOut'	: 'none'	
			});

			$("a#example4").fancybox({
				'opacity'		: true,
				'overlayShow'	: false,
				'transitionIn'	: 'elastic',
				'transitionOut'	: 'none'
			});

			$("a#example5").fancybox();

			$("a#example6").fancybox({
				'titlePosition'		: 'outside',
				'overlayColor'		: '#000',
				'overlayOpacity'	: 0.9
			});

			$("a#example7").fancybox({
				'titlePosition'	: 'inside'
			});

			$("a#example8").fancybox({
				'titlePosition'	: 'over'
			});

			$("a[rel=example_group]").fancybox({
				'transitionIn'		: 'none',
				'transitionOut'		: 'none',
				'titlePosition' 	: 'over',
				'titleFormat'		: function(title, currentArray, currentIndex, currentOpts) {
					return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
				}
			});

			/*
			*   Examples - various
			*/

			$("#various1").fancybox({
				'titlePosition'		: 'inside',
				'transitionIn'		: 'none',
				'transitionOut'		: 'none'
			});

			$("#various2").fancybox();

			$("#various3").fancybox({
				'width'				: '26%',
				'height'			: '22%',
				'autoScale'			: false,
				'transitionIn'		: 'none',
				'transitionOut'		: 'none',
				'type'				: 'iframe'
			});

			$("#various4").fancybox({
				'padding'			: 0,
				'autoScale'			: false,
				'transitionIn'		: 'none',
				'transitionOut'		: 'none'
			});
		});
	</script>
<title>E-Library</title>
</head>
<body>
<div id="wrapper">
<!-- top info starts here -->
<div id="header">
<div id="hright">
<div id="hrighttop">
<p><a id="various3" href="loginbox.html" title="Current users log in">Log in</a>  | <a href="#" title="Not a member? Register today!">Register</a></p>					
</div>
<div id="menu">
<ul>
<li><a href="#" title="Home">Home</a> |</li>
<li><a href="#" title="Services">Services</a> |</li>
<li><a href="#" title="Our people">Our people</a> |</li>
<li><a href="#" title="Client list">Help</a> |</li>
<li><a href="#" title="Contact us">test</a></li>
</ul>
</div>
</div>
<div id="title">
<h3>E-Library</h3>
<p>Lidrary in PSUPuket</p>
</div>
</div>

<!-- main content starts here -->

<div id="homepic"></div>
<div id="bottomcontenttop"></div>
<div id="bottomcontent">
<div class="right">
<p>&nbsp;dghdfh</p>
</div>
<div class="middle">
  <table border="0">
	
  	<tr>
    	<td>name:</td> 
        <td>123</td>
        
    </tr>
    <tr>
    	<td>message:</td> 
        <td>456</td>
    </tr>
    <tr>
    	<td></td>
    </tr>
    
  </table>
</div>		
<div class="left">
  	<table border="2" width="210">
    <tr>
    	<td>
        <font face="Tahoma, Geneva, sans-serif" size="2">
        Test
        <marquee width="210" height="50" direction="up"
        onmouseover = stop(); onmouseup=start();
        scrollamount="1" scrolldelay="0">
        </marquee>
        </font>
        </td>
    </tr>
    </table>
</div>	
</div>
<div id="bottomcontentbtm"></div>	
<div id="footer">
<p>&copy;2011 E-Library</p>
</div>
</div>

</body>
</html>